<template>
  <div class="show">
    <div v-if="items.length === 0" style="width: 100%;line-height: 3rem;text-align: center;font-size: large;">暂无数据</div>
    <ul v-if="items.length > 0">
      <li v-for="(item, index) in items" :key="index">
        <div class="show_item">
          <div class="show_item-title">
            {{item.entname}}
            <Button v-if="item.state=='1'" type="error" @click="sure(item)">进入确认</Button>
          </div>
          <div class="show_item-info">
            <p v-if="item.state === '2' && item.assign === '1'" style="color: #0bb20c">状态：已授权</p>
            <p v-else-if="item.state === '2'" style="color: #00b3ff">状态：已确认</p>
            <p v-else style="color: red">状态：未确认</p>
            <p>业务类型：{{item.opertype | dict('CD01')}}</p>
            <p>申请时间：{{item.appdate}}</p>
            <p>确认人名称：{{item.name}}</p>
            <p>确认人角色：{{item.qztitle}}</p>
          </div>
        </div>
      </li>
    </ul>
    <div class="show_bottom">
      <MyFooter />
    </div>
  </div>
</template>

<script>
  import MyFooter from '../../components/MyFooter.vue'
  import request from '../../utils/request'
  export default {
    data() {
      return {
        items: []
      }
    },
    components: {
      MyFooter
    },
    methods: {
      queryList() {
         request.get('/interface/wechat/confirm/queryList.do'
        ).then(response => {
          if (response.data.result === 'error') {
            this.$ErrorAlert(response.data.message)
            return null
          }
          // 成功逻辑
          this.items = response.data.data
        })
      },
      sure(item) {
        let lastToken = localStorage.getItem('lastToken')
        let nowToken = localStorage.getItem('nowToken')
        let lastConfirmid = localStorage.getItem('confirmid')
        if (lastToken !== nowToken || lastConfirmid !== item.confirmid) {
          request.get('/interface/wechat/confirm/getPhoto.do', {
            token: nowToken,
            regorg: localStorage.getItem('regorg')
          }).then(response => {
            if (response.data.result === 'error') {
              this.$ErrorAlert(response.data.message)
              return null
            }
            let photoBase64 = response.data.data
            request.post('/outer/file/confirm/uploadPhoto.do', {
              gid: item.gid,
              confirmid: item.confirmid,
              file: photoBase64
            }).then(response => {
              if (response.data.result === 'error') {
                this.$ErrorAlert(response.data.message)
                return null
              }
              // 成功逻辑
              localStorage.setItem('lastToken', nowToken)
              localStorage.setItem('confirmid', item.confirmid)
              sessionStorage.setItem('confirmid', item.confirmid)
              sessionStorage.setItem('confirm', JSON.stringify(item))
              this.$router.push({name: 'BusinessConfirmProcess'})
            })
          })
        } else {
          sessionStorage.setItem('confirm', JSON.stringify(item))
          this.$router.push({name: 'BusinessConfirmProcess'})
        }
      }
    },
    mounted() {
      localStorage.setItem('regorg', this.$route.params.regorg)
      this.queryList()
    }
  }

</script>

<style lang="scss" scoped>
  .show {
    position: relative;
    min-height: 100%;
    background: #f3f3f3;
    padding-bottom: 1.75rem;
    li {
      margin-bottom: 0.54rem;
      background: #fff;
      padding: 0.54rem;
      overflow: hidden;
      &:last-child {
        margin-bottom: 0;
      }
    }
    &_item {
      background: #fff;
      &-title {
        color: #00b3ff;
        border-bottom: 1px solid #eaeaea;
        padding-bottom: 0.22rem;
        margin-bottom: 0.14rem;
        button {
          float: right;
          margin-left: 0.54rem;
        }
      }
      &-info {
        // display: flex;
        // justify-content: space-between;
        font-size: 0.5rem;
        color: #7d7d7d;
        // overflow: hidden;
        // white-space: nowrap;
        padding: 0.36rem 0;
      }
    }
    &_bottom {
      position: absolute;
      bottom: 0;
      width: 100%;
      height: 1.75rem;
    }
  }

</style>
